<template>
  <div>
    <!--记住使用v-model-->
    <input type="text" name="inputvalue" v-model="num" /><br />
    <span>{{ num }}</span>
  </div>
</template>

<script>
import { customRef,ref } from "vue";
export default {
  name: "ManualRef",
  setup() {
    /*封装一个自定义的ref*/
    function myRef(value, times) {
      let timer;
      return customRef((track, trigger) => {
        return {
          get() {
            track();
            return value;
          },
          set(newValue) {
            clearTimeout(timer)
            timer = setTimeout(() => {
              value = newValue;
              trigger();
            }, times);
          },
        };
      });
    }
    // let num = myRef(0,1000);
    let num = ref(100);
    return {
      num,
    };
  },
};
</script>
<style scoped>
</style>